<template>
  <Card>
    <Form ref="searchForm" :label-width="90" :model="searchForm" inline>
      <Form-item label="车辆线路：" prop="line">
        <Select v-model="searchForm.line" clearable placeholder="选择线路" style="width:200px;">
          <Option value="-1">全部</Option>
          <Option v-for="item in lines" :key="item.line" :value="item.line">{{ item.line }}</Option>
        </Select>
      </Form-item>
      <Form-item label="车牌号：" prop="license_plate_num">
        <Input
          v-model="searchForm.license_plate_num"
          clearable
          placeholder="支持模糊搜索"
          style="width: 200px"
          type="text"
        />
      </Form-item>
      <Form-item label="日期：" prop="date">
        <DatePicker
          v-model="searchForm.date"
          placeholder="请选择月份"
          placement="bottom-start"
          style="width: 200px"
          type="month"
          @change="dateChange('search')"
        ></DatePicker>
      </Form-item>
      <Form-item style="margin-left:-70px;">
        <Button icon="md-search" type="primary" @click="getAttendanceAccountingDate()">搜索</Button>
        <Button icon="md-refresh" @click="handleReset()">重置</Button>
      </Form-item>
    </Form>
    <Alert type="error">{{ date_text }}</Alert>
    <Form ref="dataForm" :label-width="90" :model="dataForm" inline>
      <Form-item label="日期范围：" prop="date">
        <DatePicker
          v-model="dataForm.date"
          placeholder="请选择月份"
          placement="bottom-start"
          style="width: 200px"
          type="month"
          @change="dateChange('data')"
        ></DatePicker>
      </Form-item>
      <Form-item style="margin-left:-70px;">
        <Button
          :loading="dataLoading"
          icon="md-search"
          type="primary"
          @click="createData()"
        >生成考勤统计数据
        </Button>
      </Form-item>
    </Form>
    <Button
      :disabled="exportBtnDisable"
      icon="md-cloud-download"
      style="margin-bottom:15px"
      type="primary"
      @click="exportAttendanceAccounting"
    >导出
    </Button>
    <Table :columns="columns" :data="data" :loading="listLoading" border>
      <template slot="action" slot-scope="{ row, index }">
        <a style="color:#2d8cf0;font-size: 12px;" @click="edit(row,index)">编辑</a>
      </template>
    </Table>
    <Row class="page" justify="end" type="flex">
      <Page
        :current="searchForm.pageNumber"
        :page-size="searchForm.pageSize"
        :total="total"
        show-total
        @on-change="changePage"
      />
    </Row>
  </Card>
</template>
<script>
import {attendanceAccounting, attendanceAccountingData, attendanceAccountingDate} from '../../api/attendance'

export default {
  data() {
    return {
      dataForm: {
        date: ''
      },
      searchForm: {
        line: '-1',
        license_plate_num: '',
        pageNumber: 1,
        pageSize: 10
      },
      listLoading: false,
      dataLoading: false,
      exportBtnDisable: true,
      columns: [],
      data: [],
      lines: [],
      total: 0,
      date_time_days: [],
      date_text: ''
    }
  },
  mounted() {
    this.init()
  },
  methods: {
    changePage(v) {
      this.searchForm.pageNumber = v
      this.getDataList()
    },
    createData() {
      if (!this.dataForm.date) {
        this.$Message.error('请选择生成考勤数据的日期')
        return
      }
      attendanceAccounting(this.dataForm).then(res => {
        if (res.data.result.length == 0) {
          this.dataLoading = true
          attendanceAccountingData(this.dataForm).then(res => {
            this.dataLoading = false
            if (res.data) {
              this.$Message.success('考勤数据已生成')
              this.getAttendanceAccountingDate()
            } else {
              this.$Message.error(res.message)
            }
          })
        } else {
          this.$Modal.confirm({
            title: '已生成数据，确认重新生成？',
            loading: true,
            content: '已生成数据，确认重新生成？',
            onOk: () => {
              this.$Modal.remove()
              this.dataLoading = true
              attendanceAccountingData(this.dataForm).then(res => {
                this.dataLoading = false

                this.$Message.success('考勤数据已生成')
                this.getAttendanceAccountingDate()
                // if(result.data){
                //   this.$Message.success('考勤数据已生成');
                //   this.getAttendanceAccountingDate();
                // }else{
                //   this.$Message.error(res.message);
                // }
              })
            }
          })
        }
      })
    },
    dateChange(v) {
      let month = ''
      if (v == 'search') {
        month = new Date(this.searchForm.date)
      } else {
        month = new Date(this.dataForm.date)
      }
      const year = month.getFullYear()
      let start_month =
        month.getMonth() > 9 ? month.getMonth() : '0' + month.getMonth()
      const end_month =
        month.getMonth() + 1 > 9
          ? month.getMonth() + 1
          : '0' + (month.getMonth() + 1)
      let start_year = month.getFullYear()
      if (start_month == '00') {
        start_year = year - 1
        start_month = 12
      }
      const start_time = start_year + '-' + start_month + '-26'
      const end_time = year + '-' + end_month + '-25'
      if (v == 'search') {
        this.date_text = '搜索时间：' + start_time + '到' + end_time
      } else {
        this.date_text = '生成数据时间：' + start_time + '到' + end_time
      }
    },
    edit(row) {
      this.$router.push({
        name: 'editAttendanceAccounting',
        params: {
          id: row.id
        }
      })
    },
    //导出
    exportAttendanceAccounting() {
      const line = this.searchForm.line
      const license_plate_num = this.searchForm.license_plate_num
      const date = this.searchForm.date

      window.location.href =
        '/api/exportAttendanceAccounting?line=' +
        line +
        '&license_plate_num=' +
        license_plate_num +
        '&date=' +
        date
    },
    getAttendanceAccountingDate() {
      const _this = this
      _this.columns = []
      attendanceAccountingDate(this.searchForm).then(res => {
        this.lines = res.data.line
        _this.columns.push(
          {
            title: '车牌号',
            key: 'license_plate_num',
            align: 'center',
            width: 120
          },
          {
            title: '姓名',
            key: 'driver',
            align: 'center',
            width: 100
          },
          {
            title: '线路',
            key: 'line',
            align: 'center',
            width: 100
          }
        )
        res.data.result.forEach(em => {
          _this.columns.push({
            title: em.d,
            key: em.d,
            align: 'center',
            width: 80
          })
        })
        _this.columns.push(
          {
            title: '合 计',
            align: 'center',
            children: [
              {
                title: '小计',
                key: 'total_d',
                align: 'center',
                width: 80
              },
              {
                title: '加班',
                key: 'monthly_cost',
                align: 'center',
                width: 80
              },
              {
                title: '修车',
                key: 'm_air_yihua',
                align: 'center',
                width: 80
              },
              {
                title: '停运',
                key: 'repair',
                align: 'center',
                width: 80
              },
              {
                title: '晚上加班',
                key: 'tire',
                align: 'center',
                width: 80
              }
            ]
          },
          {
            title: '备注',
            key: 'remark',
            align: 'center',
            width: 80
          },
          {
            title: '操作',
            slot: 'action',
            width: 120,
            fixed: 'right',
            align: 'center'
          }
        )
      })
      this.getDataList()
    },
    getDataList() {
      this.listLoading = true
      attendanceAccounting(this.searchForm).then(res => {
        this.listLoading = false
        this.data = res.data.result
        this.total = res.data.count
        this.searchForm.date = res.data.date
        if (
          this.searchForm.line ||
          this.searchForm.license_plate_num ||
          this.searchForm.date
        ) {
          this.exportBtnDisable = false
        }
        const month = new Date(this.searchForm.date)
        const year = month.getFullYear()
        let start_month =
          month.getMonth() > 9 ? month.getMonth() : '0' + month.getMonth()
        const end_month =
          month.getMonth() + 1 > 9
            ? month.getMonth() + 1
            : '0' + (month.getMonth() + 1)
        let start_year = month.getFullYear()
        if (start_month == '00') {
          start_year = year - 1
          start_month = 12
        }
        const start_time = start_year + '-' + start_month + '-26'
        const end_time = year + '-' + end_month + '-25'
        this.date_text = '搜索时间为：' + start_time + '到' + end_time
      })
    },
    handleReset() {
      this.searchForm = {
        line: '-1',
        license_plate_num: '',
        pageNumber: 1,
        pageSize: 10
      }
    },
    handleSearch() {
    },
    init() {
      this.getAttendanceAccountingDate()
    }
  }
}
</script>
